<!--
* @author luguoxiang
* @date 2021-09-07
* 开源项目：https://gitee.com/lgx1992/lg-soar 求star！请给我star！请帮我点个star！
-->
<template>
  <t-dropdown
    v-if="options"
    class="lg-btn-list-more"
    :options="options"
    :popup-props="{ overlayInnerClassName: 'lg-btn-list' }"
  >
    <slot></slot>
  </t-dropdown>
  <div v-else class="lg-btn-list-more" @mouseover="mouseover">
    <slot></slot>
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const props = defineProps({
  children: Array,
  index: Number,
});
// 延迟渲染提升页面渲染速度（在需要时渲染下拉组件）
const options = ref();
function mouseover() {
  options.value = props.children.slice(props.index).map((x) => ({ content: x }));
}
</script>
